<template>
  <div class="dlg">
    <el-dialog
      :title="categoryName"
      :visible="showDlg"
      :show-close="false"
      width="60%"
      @open="refreshList"
    >
      <div>
        <el-tag v-for="item of list" :key="item.orgId">{{item.orgName}}</el-tag>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="$emit('close')">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { Dialog, Button, Tag } from "element-ui";
import { getOrgCategoryDetailList } from "@/api/first-loan.js";
export default {
  name: "show-org-dlg",
  components: {
    [Dialog.name]: Dialog,
    [Button.name]: Button,
    [Tag.name]: Tag
  },
  props: {
    showDlg: Boolean,
    categoryId: Number
  },
  data() {
    return {
      categoryName: "",
      list: []
    };
  },
  methods: {
    refreshList() {
      getOrgCategoryDetailList(this.categoryId)
        .then(res => {
          this.categoryName = res.firstLoanOrgCategoryName;
          this.list = res.firstLoanOrgVoList;
        })
        .catch(errMsg => this.$alert(errMsg.msg));
    }
  }
};
</script>
<style lang="stylus" scoped>
.el-tag{
    margin-right: 12px;
    margin-bottom: 5px;
}
</style>